<style lang='less'>

</style>

<template>
    <div>
        <div style="height: 75vh;overflow-y: auto;overflow-x: hidden;">
        <pdf :src="pdfsrc"></pdf>
        </div>
    </div>
</template>

<script>
import pdf from 'vue-pdf'
import axios from '@/libs/api.request'
export default {
  components: {
    pdf
  },
  data () {
    return {
      mshow: false,
      openNow: false,
      cardShow: false,
      modal_loading: false,
      serverResult: '',
      pdfsrc: '',
      numPages: undefined
    }
  },
  methods: {
    previewPDF (url) {
      this.pdfsrc = pdf.createLoadingTask(url)
    },
    downloadPDF (url, fileName) {
      axios({
        method: 'get',
        responseType: 'arraybuffer',
        url: url
      }).then(function (res) {
        // 调用下载方法，把后端传过来的流传给fileDownload方法
        this.fileDownload(res.data, fileName)
      }.bind(this)
      )
    },
    fileDownload: function (data, fileName) {
      let blob = new Blob([data], {
        // type类型后端返回来的数据中会有，根据自己实际进行修改
        type: 'application/vnd.ms-excel'
      })
      let filename = fileName || '报表.xls'
      if (typeof window.navigator.msSaveBlob !== 'undefined') {
        window.navigator.msSaveBlob(blob, filename)
      } else {
        var blobURL = window.URL.createObjectURL(blob)
        // 创建隐藏<a>标签进行下载
        var tempLink = document.createElement('a')
        tempLink.style.display = 'none'
        tempLink.href = blobURL
        tempLink.setAttribute('download', filename)
        if (typeof tempLink.download === 'undefined') {
          tempLink.setAttribute('target', '_blank')
        }
        document.body.appendChild(tempLink)
        tempLink.click()
        document.body.removeChild(tempLink)
        window.URL.revokeObjectURL(blobURL)
      }
    }
  },
  mounted () {
    if (!window.WebSocket) {
      alert('浏览器不支持HTML5,请更新浏览器或者使用其它浏览器')
    }
    this.previewPDF('../../static/2212.pdf')
    // this.pdfsrc = '../../static/2212.pdf'
  }
}
</script>

<style>

</style>
